<template>
  <div class>
    <el-card class="box-card">
      <div slot="header" class="clearfix">
        <span>企业人员</span>
      </div>
      <el-table :data="entperson" border style="width: 100%" size="mini">
          <el-table-column  align="center" width="80">
            <template slot="header">
             <el-button class="el-icon-circle-plus" @click.prevent="addRow1()"></el-button>
            </template>
            <template slot-scope="scope">
              <el-button size="mini" type="danger" class="el-icon-remove"
              @click="handleDelete1(scope.$index, scope.row)"></el-button>
          </template>
          </el-table-column>
          <el-table-column
            type="index"
            width="50" label="NO.">
          </el-table-column>
          <el-table-column label="姓名" align="center">
            <template slot-scope="scope">
              <el-input v-model="scope.row.peoName"></el-input>
            </template>
          </el-table-column>
          <el-table-column label="性别" align="center">
            <template slot-scope="scope">
              <el-select v-model="scope.row.sex" >
                <el-option label="男" value="1"></el-option>
                <el-option label="女" value="2"></el-option>
              </el-select>
            </template>
          </el-table-column>
           <el-table-column label="证件类型" align="center">
            <template slot-scope="scope">
              <el-select v-model="scope.row.ide" >
                <el-option label="居民身份证" value="1"></el-option>
                <el-option label="护照" value="2"></el-option>
                <el-option label="营业执照号" value="3"></el-option>
                <el-option label="其他" value="4"></el-option>
              </el-select>
            </template>
          </el-table-column>
          <el-table-column label="证件号码" align="center">
            <template slot-scope="scope">
              <el-input v-model="scope.row.ideCard"></el-input>
            </template>
          </el-table-column>
          <el-table-column label="移动电话" align="center">
            <template slot-scope="scope">
              <el-input v-model="scope.row.telephone"></el-input>
            </template>
          </el-table-column>
          <el-table-column label="人员类别" align="center">
            <template slot-scope="scope">
              <el-select v-model="scope.row.personType" >
                <el-option label="法定代表人" value="1"></el-option>
                <el-option label="实际控制人" value="2"></el-option>
                <el-option label="财务负责人" value="3"></el-option>
                <el-option label="常用联系人" value="4"></el-option>
                <el-option label="其他" value="5"></el-option>
              </el-select>
            </template>
          </el-table-column>
          <el-table-column label="婚姻状况" align="center">
            <template slot-scope="scope">
              <el-select v-model="scope.row.maritalStatus" >
                <el-option label="已婚" value="1"></el-option>
                <el-option label="未婚" value="2"></el-option>
                <el-option label="离异" value="3"></el-option>
                <el-option label="未知（适用诉讼保全业务）" value="4"></el-option>
              </el-select>
            </template>
          </el-table-column>
          <el-table-column label="学历" align="center">
            <template slot-scope="scope">
              <el-select v-model="scope.row.education" >
                <el-option label="大专以下" value="1"></el-option>
                <el-option label="大专" value="2"></el-option>
                <el-option label="本科" value="3"></el-option>
                <el-option label="研究生及以上" value="4"></el-option>
              </el-select>
            </template>
          </el-table-column>
          <el-table-column label="家庭地址" align="center">
            <template slot-scope="scope">
              <el-input v-model="scope.row.address"></el-input>
            </template>
          </el-table-column>
          <el-table-column label="备注" align="center">
            <template slot-scope="scope">
              <el-input v-model="scope.row.remark"></el-input>
            </template>
          </el-table-column>
        </el-table>
    </el-card>
    <el-card class="box-card">
      <div slot="header" class="clearfix">
        <span>其他人员</span>
      </div>
      <el-table :data="entOther" border style="width: 100%" size="mini">
          <el-table-column  align="center" width="80">
            <template slot="header">
             <el-button class="el-icon-circle-plus" @click.prevent="addRow2()"></el-button>
            </template>
            <template slot-scope="scope">
              <el-button size="mini" type="danger" class="el-icon-remove"
              @click="handleDelete2(scope.$index, scope.row)"></el-button>
          </template>
          </el-table-column>
          <el-table-column
            type="index"
            width="50" label="NO.">
          </el-table-column>
          <el-table-column label="姓名" align="center">
            <template slot-scope="scope">
              <el-input v-model="scope.row.peoName"></el-input>
            </template>
          </el-table-column>
          <el-table-column label="性别" align="center">
            <template slot-scope="scope">
              <el-select v-model="scope.row.sex" >
                <el-option label="男" value="1"></el-option>
                <el-option label="女" value="2"></el-option>
              </el-select>
            </template>
          </el-table-column>
           <el-table-column label="证件类型" align="center">
            <template slot-scope="scope">
              <el-select v-model="scope.row.ide" >
                <el-option label="居民身份证" value="1"></el-option>
                <el-option label="护照" value="2"></el-option>
                <el-option label="营业执照号" value="3"></el-option>
                <el-option label="其他" value="4"></el-option>
              </el-select>
            </template>
          </el-table-column>
          <el-table-column label="证件号码" align="center">
            <template slot-scope="scope">
              <el-input v-model="scope.row.ideCard"></el-input>
            </template>
          </el-table-column>
          <el-table-column label="年龄" align="center">
            <template slot-scope="scope">
              <el-input v-model="scope.row.age"></el-input>
            </template>
          </el-table-column>
          <el-table-column label="学历" align="center">
            <template slot-scope="scope">
              <el-select v-model="scope.row.xueli" >
                <el-option label="大专以下" value="1"></el-option>
                <el-option label="大专" value="2"></el-option>
                <el-option label="本科" value="3"></el-option>
                <el-option label="研究生及以上" value="4"></el-option>
              </el-select>
            </template>
          </el-table-column>
          <el-table-column label="工作单位" align="center">
            <template slot-scope="scope">
              <el-input v-model="scope.row.workAddress"></el-input>
            </template>
          </el-table-column>
          <el-table-column label="家庭地址" align="center">
            <template slot-scope="scope">
              <el-input v-model="scope.row.Address"></el-input>
            </template>
          </el-table-column>
          <el-table-column label="联系电话" align="center">
            <template slot-scope="scope">
              <el-input v-model="scope.row.phone"></el-input>
            </template>
          </el-table-column>
          <el-table-column label="备注" align="center">
            <template slot-scope="scope">
              <el-input v-model="scope.row.remark"></el-input>
            </template>
          </el-table-column>
        </el-table>
    </el-card> 
  </div>
</template>

<script>
export default {
  components: {},
  data() {
    return {
     entperson: [],
     entOther:[],
    };
  },
  computed: {},
  mounted() {
 
  },
  methods: {
    //获取企业人员信息
    getEntPersonData(){
      return this.entperson;
    },
    //获取其他人员信息
    getEntOtherData(){
      return this.entOther;
    },
    // 增加企业人员行
    addRow1() {
      var list = {
        status:'1'
      }
      this.entperson.unshift(list)
    },
    //删除企业人员行
    handleDelete1(index, row) {
        this.entperson.splice(index, 1);
      },
       // 增加其他人员行
    addRow2() {
      var list = {
       status:'2'
      }
      this.entOther.unshift(list)
    },
    //删除其他人员行
    handleDelete2(index, row) {
        this.entOther.splice(index, 1);
      }

  },
  created() {}
};
</script>
<style lang='scss' scoped>

</style>